<script setup>
import { onMounted, ref } from "vue";
import * as Cesium from "cesium";
import CesiumWave from "./components/wave/CesiumWave.vue";
import CesiumPerformanceMonitor from "./components/CesiumPerformanceMonitor.vue";
import Primitive from "./components/test/primitive.vue";
import UavLineTest from "./components/uav1/UavLineTest.vue";
import UavHistory from "./components/uav1/UavHistory.vue";
import Uav2 from "./components/uav2/Uav2.vue";
import UavModelLayer from "./components/uav1/UavModelLayer.vue";
import UavRequest from "./components/uav1/UavRequest.vue";
import History from "./components/history/History.vue";
import UavModelLayer2 from "./components/uav1/UavModelLayer2.vue";
import Generator from "./components/Generator.vue";

Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4ZDdhMWI3Yy00NDM5LTQwZmMtYjI0ZC1mODdkNmI4OWZmNTQiLCJpZCI6MjE4NzEzLCJpYXQiOjE3NDg5MTQyNTB9.ry6ey8HVNGdvY_5op5BxnHRRDC5H1O2XPC32aVRc5CU'

let TdtEvaImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
  url: "https://t0.tianditu.gov.cn/img_w/wmts?tk=3273526e491a410e39f68bbe68bf712c",
  layer: "img", // 影像底图
  style: "default",
  tileMatrixSetID: "w",
  format: "tiles",
  maximumLevel: 18,
  subdomains: ["0", "1", "2", "3", "4", "5", "6", "7"],
});
const map = ref(null);
const showPerformance = ref(true); // 控制性能监视器显示状态

const uavModelLayer = ref(null);

const cesiumWave = ref(null);

const PoiRef = ref(null);

const Uav2Ref = ref(null);

const uavLineTestRef = ref(null);

const uavRequestRef = ref(null);

const uavHistoryRef = ref(null);

const primitiveRef = ref(null);

const historyRef = ref(null);

const uavModelLayer2Ref = ref(null);

// 定义目标点位
const targetPosition = {
  longitude: 115.948259,
  latitude: 38.797289,
  height: 200,
};

// 飞入到指定点位
const flyToTargetPosition = (viewer) => {
  // 创建目标位置的Cartesian3对象
  const destination = Cesium.Cartesian3.fromDegrees(
    targetPosition.longitude,
    targetPosition.latitude,
    targetPosition.height + 500 // 稍微增加高度以获得更好的视角
  );

  // 设置相机朝向
  const heading = Cesium.Math.toRadians(0); // 方位角，0度为正北
  const pitch = Cesium.Math.toRadians(-45); // 俯仰角，负值表示向下看
  const roll = 0; // 翻滚角

  // 使用flyTo方法飞入到目标位置
  viewer.camera.flyTo({
    destination: destination,
    orientation: {
      heading: heading,
      pitch: pitch,
      roll: roll,
    },
    duration: 3, // 飞行时间，单位为秒
    complete: () => {
      console.log("已飞入到指定位置");
    },
  });
};

onMounted(async () => {
  map.value = new Cesium.Viewer("cesium", {
    selectionIndicator: false,
    infoBox: false,
    orderIndependentTranslucency: false,
    shouldAnimate: true,
    geocoder: false, //搜索框
    homeButton: false, //home按键
    animation: false, //动画控件
    fullscreenButton: false, //全屏按钮
    sceneModePicker: false, //2D/3D切换按钮
    timeline: false, //时间线
    navigationHelpButton: false, //帮助按钮
    baseLayerPicker: false, //图层选择按钮
    requestRenderMode: true, //实时渲染
    contextOptions: {
      webgl: {
        alpha: true,
        depth: true,
        stencil: true,
      },
    },
  });
  // 移除默认底图
  map.value.imageryLayers.removeAll();

  // 添加天地图底图
  map.value.scene.imageryLayers.addImageryProvider(TdtEvaImageryProvider);
  map.value.scene.globe.depthTestAgainstTerrain = true;

  if (uavModelLayer.value) {
    uavModelLayer.value.initialize(map.value);
  }

  if (cesiumWave.value) {
    // cesiumWave.value.initCesiumWave(map.value);
  }

  if (PoiRef.value) {
    PoiRef.value.initPOI(map.value);
  }

  if (Uav2Ref.value) {
    await Uav2Ref.value.initUav2(map.value);
  }

  if (uavLineTestRef.value) {
    await uavLineTestRef.value.initUavLineTest(map.value);
  }

  if (uavRequestRef.value) {
    await uavRequestRef.value.initialize(map.value);
  }

  if (uavHistoryRef.value) {
    uavHistoryRef.value.initUavHistory(map.value);
  }

  if (primitiveRef.value) {
    primitiveRef.value.initPrimitive(map.value);
  }

  if (historyRef.value) {
    await historyRef.value.initHistory(map.value);
  }

  if (uavModelLayer2Ref.value) {
    await uavModelLayer2Ref.value.init(map.value);
  }

  // 直接飞入到指定点位
  // flyToTargetPosition(map.value);
});
</script>

<template>
  <div id="cesium" class="map-box"></div>
  <Generator></Generator>
  <!-- <UavModelLayer ref="uavModelLayer" /> -->
  <!-- <CesiumWave ref="cesiumWave" /> -->
  <CesiumPerformanceMonitor v-if="showPerformance && map" :viewer="map" position="top-right"
    backgroundColor="rgba(0, 0, 0, 0.7)" />
  <!-- <History ref="historyRef" /> -->
  <!-- <Primitive ref="primitiveRef" /> -->
  <!-- <UavRequest ref="uavRequestRef" /> -->
 <!-- <UavLineTest ref="uavLineTestRef" /> -->
  <!-- <Poi ref="PoiRef"></Poi> -->
  <!-- <Uav2 ref="Uav2Ref"></Uav2> -->
  <!-- <UavHistory ref="uavHistoryRef" /> -->
  <UavModelLayer2 ref="uavModelLayer2Ref" />
</template>

<style scoped></style>
